<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link href="framework/reset.css" rel="stylesheet">
    <link href="framework/icons/tdesign.css" rel="stylesheet">
    <link href="css/wrapper.css" rel="stylesheet">
    <link href="css/top.css" rel="stylesheet">
    <link href="css/footer.css" rel="stylesheet">
    <script src="js/fixTop.js"></script>

    <link href="css/user.css" rel="stylesheet">
    <script src="js/pop-menu.js"></script>
    <title>菜单</title>
</head>
<body>
    <div class="wrapper">
        <div class="main">
            <div class="top-area">
                <div class="top-area-fix" id="fixedBox">
                    <!-- top部分 -->
                    <div class="top">
                        <div class="return" onclick="location.href='shop.html'">
                            <i class="i tdesign:chevron-left"></i>
                        </div>
                        <div class="top-title">
                            <p>菜单</p>
                        </div>
                        <div class="user_head" onclick="location.href='userInfo.html'">
                            <img src="img/user_head.jpg">
                        </div>
                    </div>
                </div>
            </div>

            <div class="userPart">
                <div class="option-wrapper" id="open-option1" onclick="showPopup1()">
                    <div class="option">
                        <div class="i tdesign:discount-filled"></div>
                        <p>商店</p>
                        <p style="font-size: 4vw; font-weight: normal; color: #75be53">(&#165;0.00)</p>
                        <div class="i tdesign:chevron-down"></div>
                    </div>
                </div>
                <div class="fold-option" id="fold-option1" onclick="hidePopup1()">
                    <div class="fold-option-box">
                        <div class="i tdesign:discount-filled"></div>
                        <p>商店</p>
                        <p style="font-size: 4vw; font-weight: normal; color: #75be53">(&#165;0.00)</p>
                        <div class="i tdesign:chevron-up"></div>
                    </div>
                </div>
                <ul class="pop-menu" id="pop-menu1">
                    <li onclick="location.href='shop.html'">商店主页</li>
                    <li>优惠</li>
                    <li>新品</li>
                    <li>探索队列</li>
                    <li>点数商店</li>
                    <li onclick="location.href='wishlist.html'">愿望单</li>
                    <li>钱包</li>
                </ul>

                <div class="option">
                    <div class="i tdesign:article"></div>
                    <p>新闻</p>
                </div>
                <div class="option"  onclick="location.href='secure.html'">
                    <div class="i tdesign:shield-error"></div>
                    <p>Steam 令牌</p>
                </div>
                <div class="option">
                    <div class="i tdesign:notification-filled"></div>
                    <p>通知</p>
                </div>
                <div class="option">
                    <div class="i tdesign:check"></div>
                    <p>确认</p>
                </div>
                <div class="option" onclick="location.href='library.html'">
                    <div class="i tdesign:grid-view"></div>
                    <p>库</p>
                </div>

                <div class="option-wrapper" id="open-option2" onclick="showPopup2()">
                    <div class="option">
                        <div class="i tdesign:usergroup"></div>
                        <p>社区</p>
                        <div class="i tdesign:chevron-down"></div>
                    </div>
                </div>
                <div class="fold-option" id="fold-option2" onclick="hidePopup2()">
                    <div class="fold-option-box">
                        <div class="i tdesign:usergroup"></div>
                        <p>社区</p>
                        <div class="i tdesign:chevron-up"></div>
                    </div>
                </div>
                <ul class="pop-menu" id="pop-menu2">
                    <li>社区主页</li>
                    <li>讨论区</li>
                    <li>市场</li>
                    <li>直播</li>
                    <li>创意工坊</li>
                </ul>

                <div class="option">
                    <div class="i tdesign:chat-bubble-1"></div>
                    <p>聊天</p>
                </div>

                <div class="end-option">
                    <div class="i tdesign:sound"></div>
                    <p>对此应用进行反馈</p>
                </div>
                <div class="end-option">
                    <div class="i tdesign:setting-1"></div>
                    <p>设置</p>
                </div>
                <div class="end-option">
                    <div class="i tdesign:help-circle-filled"></div>
                    <p>客服</p>
                </div>
                <div class="end-option">
                    <div class="i tdesign:gamepad-1"></div>
                    <p>获取 Steam 流式应用</p>
                </div>

                <div class="end-explain">
                    <img src="img/Valve.jpg">
                    <p>©2024 Valve Corporation。保留所有权利。</p>
                    <p>所有商标均为其在美国及其它国家/地区的各自持有者所有。</p>
                    <div>
                        <span>隐私政策 |</span>
                        <span>法律信息 |</span>
                        <span>Steam 订户协议 |</span>
                        <span>退款</span>
                    </div>
                </div>











            </div>
        </div>

        <ul class="footer">
            <li  class="shop" onclick="location.href='shop.html'">
                <i class="i tdesign:discount-filled"></i>
            </li>
            <li class="news">
                <i class="i tdesign:article"></i>
            </li>
            <li class="secure" onclick="location.href='secure.html'">
                <i class="i tdesign:shield-error"></i>
            </li>
            <li class="notification">
                <i class="i tdesign:notification-filled"></i>
            </li>
            <li class="user" onclick="location.href='user.html'">
                <i class="i tdesign:view-list"></i>
            </li>
        </ul>
    </div>
</body>
</html>